Ext.define('Triends.view.TingOpen', {
 	extend: 'Ext.form.Panel',
 	requires: ['Triends.view.MapOverlay'], 
 	xtype: 'tingopen',
 	id: 'tingopen',
 	config: {
 		fullscreen: true,
 		layout: 'vbox',
 		style: 'background-color:white',
 		listeners: {
 			initialize: function() {
//				var wrapper = this.getScrollable().getElement();
//				console.log(wrapper);
//   				var unloader = new Unloader(wrapper, '.x-container x-data-item');
//
//				var masterScroll = new iScroll(wrapper.getId(), {
//    				onRefresh: function() {
//        				unloader.setup(this.x, this.y);
//    				},
//    				onPositionChange: function(x, y) {
//        				unloader.onmove(x, y); 
//    				}
//				});
//				this.getScrollable().setScroller(masterScroll);
				
			},
			deactivate: function(oldActiveItem, container, newActiveItem, eOpts) {
					Ext.getCmp("tingtitle").reset();
					Ext.getCmp("tingcontent").reset();
					Ext.getCmp("tingtheme").reset();
				}
			
 		},
 		items: [
 			{
 				xtype: 'titlebar',
 				docked: 'top',
 				title: 'Ting Open',
 				ui: 'light'
 			},
 			{
	 			xtype: 'fieldset',
	 			title: 'Title',
	 			items: [{
	 					xtype: 'textfield',
	 					id: 'tingtitle',
	 					style: 'border:3px inset'
	 				}
	 			]
 			},
 			{
 				xtype: 'panel',
 				layout: 'hbox',
 				width: "100%",
 				items: [{
	 				xtype: 'fieldset',
	 				title: 'Theme',
	 				layout: 'hbox',
					width: '92%',
	 				items: [
	 					{
			 				 xtype: 'selectfield',
			 				 style: 'border:3px inset',
			 				 flex: 9,
			 				 usePicker: false,
			 				 id: 'tingtheme',
			 				 options: [
			 				 	{text: ' ', value: ' '},
							 	{text: '식사', value: 1},
							 	{text: '술', value: 2},
							 	{text: '야경', value: 3},
							 	{text: '공연 관람', value: 4},
							 	{text: '쇼핑', value: 5},
							 	{text: '클러빙', value: 6},
							 	{text: '전체', value: 7}
			 				 ],
			 				 listeners:{
			 				 	change: function(selectbox,newValue,oldValue){
			 				 		var themevalue = Ext.getCmp('tingtheme').getValue();
			 				 		Ext.getCmp('themeimage').setHidden(false);
			 				 		Ext.getCmp('themeimage').setSrc('resource/images/'+themevalue+'.png');	
			 				 	}
			 				 }
					}] 
 				},
 				{
					xtype: 'spacer',
					width: '2%'
				},
				{
					xtype: 'panel',
					docked: 'right',
					width: 48,
					height: 48,
					style: 'margin-top:45px',
					items: [{
						xtype: 'image',
						id: 'themeimage',
						width: 48,
						height: 48
					}]
				}]
 			},
 			{ 			
	 			xtype: 'panel',
	 			layout: 'vbox',
	 			items: [
	 			{
	 				xtype: 'fieldset',
	 				title: 'Date',
	 				items:[
				 			{
								xtype: 'datetimepickerfield',
								label: 'Date',
								inputCls: 'selectfield',
								style: 'border:3px inset',
								id: 'tingdate',
								picker: {
										hideOnMaskTap: true,
										useTitles: true,
										yearFrom: 2013,
										yearTo: 2015,
										minuteInterval:30,
										ampm: true,
										slotOrder: ['year', 'month', 'day', "ampm", "hour", "minute"]
								}
			 				}
	 				]
	 			},
	 			
 				{
 					xtype: 'spacer'
 				},
 				{	
 					xtype: 'panel',
 					style: 'margin-top:15px',
 					layout: 'vbox',
 					items:[
 						{
 							xtype: 'panel',
							style: 'margin-left:15px;margin-bottom:5px',
 							html: '<b>Location</b>'
 						},
 						{
		 					xtype: 'button',
		 					iconCls: 'locate',
		 					style: {'left':'50%', 'margin-left':'-50%', 'border': '1px outset'},
		 					width: '100%',
		 					iconMask: true,
		 					handler: function(){
								var mapOverlay = Ext.create("Triends.view.MapOverlay");						
		 						var map2 = Ext.create("Triends.Map2");
		 						mapOverlay.add(map2); // 그냥 items에 집어 넣었더니 안뜬다.
								Ext.Viewport.add(mapOverlay); 							
	 						}
 						},
 						{
 							xtype: 'panel',
 							id: 'tingopenlocation',
 							style: 'margin-left:15px;margin-top:20px'
 						}]
 				}
 				]	
 			},
	 		{
	 			xtype: 'fieldset',
	 			title: 'Description',	 
	 			style: 'margin-top:30px',
	 			items: [{
	 				xtype: 'textareafield',
	 				id: 'tingcontent',
	 				maxRows: 7,
	 				style: 'border:3px inset',
	 				height: 200
	 			}]
	 		},
 			{
 				xtype: 'panel',
 				layout: 'hbox',
 				items: [{
 					xtype: 'button',
		 			text: 'Open',
		 			style: {'margin-top':'20px','left':'50%', 'margin-left':'-50%', 'border': '1px outset'},
		 			width: '100%',
		 			handler: function(){
		 				try{
			 				var userstoredata = Ext.getStore('UserStore').getAt(0).data;
							var userid = userstoredata.ID;
			 				var username = userstoredata.Name;
			 				
			 				var tingtitle = Ext.getCmp("tingtitle").getValue();
			 				var tingcontent = Ext.getCmp("tingcontent").getValue();
			 				var tingtheme = Ext.getCmp("tingtheme").getValue();
			 				var tingdate = Ext.getCmp("tingdate").getValue();
							var tingStore = Ext.getStore("tingstore");
							
							if(tingtitle == ""){
								navigator.notification.confirm(
										'Title을 입력하세요',
										function(){},
										'알림',
										'확인'
								)
								return;
							}
							if(tingtheme == " "){
								navigator.notification.confirm(
										'Theme을 입력하세요',
										function(){},
										'알림',
										'확인'
								)
								return;
							}
							if(localStorage.lat == null){
								navigator.notification.confirm(
										'위치를 입력하세요',
										function(){},
										'알림',
										'확인'
								)
								return;
							}
							if(tingcontent == ""){
								navigator.notification.confirm(
										'Description을 입력하세요',
										function(){},
										'알림',
										'확인'
								)
								return;
							}
							
							Ext.Viewport.setMasked({
								xtype: 'loadmask',
		    					indicator: true
							});
							
			 				Ext.Ajax.request({
								url: 'http://itscreater.cafe24.com/Triends/TingOpen.jsp',
								params: {id: userid, name: username, tingtitle: tingtitle, tingcontent: tingcontent, tingtheme:tingtheme, 
										lat: localStorage.lat, lng: localStorage.lng, 
										tingdate: tingdate},
//								callbackkey: 'callback',
								success: function(response){
									tingStore.removeAll();
									tingStore.loadPage(1);
									var result = Ext.JSON.decode(response.responseText);
									var userHOSTtingStore = Ext.getStore('userHOSTtingstore');
										Ext.data.JsonP.request({
						        			url: 'http://itscreater.cafe24.com/Triends/UserHostTing.jsp',
						        			params: {id: userid,
														userlat: userstoredata.UserLat,
														userlng: userstoredata.UserLng,  
														usertheme: userstoredata.UserTheme},
						        			callbackKey: 'callback',
						        			success: function(result) {
						            			for(i=0;i<result.length;i++){
													var date = result[i].DATE.split(' ')[0];
													var hour = result[i].DATE.split(' ')[1].substr(0,2);
													var minute = result[i].DATE.split(' ')[1].substr(2);
													var ampm;
													if(hour >= 12){
														hour = hour-12;
														ampm = "PM"
													} else{
														ampm = "AM"
													}
													var finaldate = date+" "+ampm+" "+hour+""+minute;
													result[i].AMPMDATE = finaldate; 
												}
										userHOSTtingStore.setData(result);
										userHOSTtingStore.load({
											callback: function() {
												
												Triends.app.getHistory().add(Ext.create('Ext.app.Action', {
			    											url: 'mainpage'
														}));
												Ext.Viewport.setMasked(false);
												navigator.notification.confirm(
													'Ting이 등록되었습니다.',
													function(){
														
													},
													'알림',
													'OK'
												)
												Ext.getCmp("tingtitle").reset();
												Ext.getCmp("tingcontent").reset();
												Ext.getCmp("tingtheme").reset();
												Ext.getCmp('themeimage').setHidden(true);
												Ext.getCmp("tingopenlocation").setHtml("");
												Ext.getCmp("tingdate").reset();
											}
											});
							        	}
									});
								}
							});
						}
						catch(e){
							navigator.notification.confirm(
								'로그인이 필요합니다.',
								function(){},
								'알림',
								'OK'
							)
		 				}
		 			}
 				}]
 			}]
 		}
});